//商品主页
'use strict';
import React, {Component} from 'react';
import Header from '../common/header'
import Util from '../common/util';
import * as URLconstant from '../constant/URLconstant'
import Modal from 'react-native-modalbox'
import Toast from '../common/ToastUtil'
import Icon from 'react-native-vector-icons/Ionicons'
import {
    View,
    Text,
    Image,
    StyleSheet,
    ScrollView,
    TouchableOpacity,
    Alert,
    TouchableWithoutFeedback,
    Platform,
    NativeModules,
    CameraRoll,
    DeviceEventEmitter
} from 'react-native';

const SaveModule = NativeModules.SavePicture;
import MyStroage from "../common/myStroage";

export default class goodsIndex extends Component {
    // 构造
    constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            goods_id: '',
            goodsData: null,
            loaded: false,
            isBox: 1,//1:整箱 0:单支
            imgHeightList: [],
            isOpen: false,
            spec_1: '',
            buy_num: 1,
            spec_2_list: [],
            shop_id: 0,
            isShow: false
        };
    }

    componentDidMount() {
        let params = this.props.route.params
        this.setState({
            goods_id: params.goods_id
        })
        this.getUser()
    }


    async getUser() {
        let userInfoDate = await MyStroage.getStorageAllDataForKey('userinfo')
        if (userInfoDate) {
            this.setState({
                user_id: userInfoDate.data.user_id
            })
            this.getGoodsIndex()
        }
    }

    getGoodsIndex() {
        let url = URLconstant.GOODINDEX_URL
        let datakey = []
        datakey['gid'] = this.state.goods_id
        datakey['user_id'] = this.state.user_id
        Util.get(url, datakey, (datas) => {
            if (datas.status == 0) {
                let goodsData = datas.data
                let goods_img = goodsData.goods.default_image
                this.setState({
                    goodsData: goodsData,
                    loaded: true,
                    goods_img: goods_img,
                    spec_stock: goodsData.goods.stock,
                    spec_price: goodsData.goods.price
                })
                this.getImageInfo(goodsData.goods.goods_detail)
            }
        }, (err) => {

        })
    }


    async getImageInfo(urls) {
        if (!urls) {
            return false
        }
        try {
            let list = [];
            await urls.map((url, index) => {
                Image.getSize(url, (width, height) => {
                    let imgheight = Util.size.width * height / width;
                    list[index] = imgheight
                    if (list.length == urls.length) {
                        this.setState({
                            imgHeightList: list,
                        })
                    }
                }, (error) => {
                    LOG('图片路径错误。。。。。。。。' + error);
                })
            })
        } catch (err) {
            LOG(err);
        }
    }


    numToChinese(len) {
        let num = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
        let chn = ['一', '两', '三', '四', '五', '六', '七', '八', '九', '十']
        let chinese
        for (let i = 0; i < num.length; i++) {
            if (len == num[i]) {
                chinese = chn[i]
            }
        }
        return chinese
    }


    prevImg(){
        let goods_img = this.state.goods_img
        let obj={
            photo:goods_img,
        }
        let goodsData = this.state.goodsData
        let title = goodsData.goods.goods_name
        this.props.navigation.push("PhotoBrowser",{
            mediaList:[obj],
            title:title
        })
    }

    showGoodsImg() {
        return (
            <TouchableOpacity onPress={() => this.prevImg()}>
                <Image
                    source={{uri: this.state.goods_img}}
                    resizeMode={'cover'}
                    style={{width: Util.size.width, height: Util.size.width}}
                />
            </TouchableOpacity>
        )
    }


    //选择规格1
    selectSpec1(item) {
        let isBox = this.state.isBox
        let is_means = this.isSupportSingle(item)
        if (isBox == 0 && is_means == 0) {
            Toast.show('该规格不支持单支出售,请选择购买整包')
        } else {
            this.setState({
                spec_1: item.spec_1,
                goods_img: item.spec_photo,
                spec_2: null,
                spec_2_list: [],
                buy_num: 1
            })
            this.getSpec2List(item.spec_1)
        }

    }

    //选择规格2
    selectSpec2(item) {
        this.setState({
            spec_2: item
        })
        this.getSpecPrice(this.state.spec_1, item)
    }

    //判断是否支持单支出售
    isSupportSingle(item) {
        let goodsData = this.state.goodsData
        let spec_1 = item.spec_1
        let spec = goodsData.spec_list.spec_1[spec_1]
        let i = 0
        for (let spec2 in spec) {
            i++
            if (i == 1) {
                return spec[spec2][''].is_means
            }
        }
    }

    //获取规格2列表
    getSpec2List(spec1) {
        let goodsData = this.state.goodsData
        let spec_2_list = []
        let spec = goodsData.spec_list.spec_1[spec1]
        let spec3 = ''
        let isBox = this.state.isBox
        for (let item in spec) {
            if (item != '') {
                if (isBox == 1) {
                    spec_2_list.push(item)
                } else {

                    if (spec[item][spec3].is_means == 1) {
                        spec_2_list.push(item)
                    }
                }
            }
        }
        LOG('spec_2_list===' + spec_2_list.length)
        let spec_2 = ''
        if (spec_2_list.length > 0) {
            spec_2 = spec_2_list[0]
        }
        this.setState({
            spec_2_list: spec_2_list,
            spec_2: spec_2
        })
        this.getSpecPrice(spec1, spec_2)
    }

    //获取规格库存 价格等
    getSpecPrice(spec1, spec2) {
        let goodsData = this.state.goodsData
        let isBox = this.state.isBox
        let spec_stock
        let spec_price
        let spec3 = ''
        if (isBox == 1) {
            spec_stock = goodsData.spec_list.spec_1[spec1][spec2][spec3].stock
            spec_price = goodsData.spec_list.spec_1[spec1][spec2][spec3].buy_price
        } else {
            spec_stock = goodsData.spec_list.spec_1[spec1][spec2][spec3].single_stock
            spec_price = goodsData.spec_list.spec_1[spec1][spec2][spec3].buy_single_price
        }
        this.setState({
            spec_stock: spec_stock,
            spec_price: spec_price
        })
    }


    showSpecPhoto(spec) {
        let rows
        let list = []
        for (let spec1 in spec) {
            let i = 0
            for (let spec2 in spec[spec1]) {
                i++
                if (i == 1) {
                    let item = spec[spec1][spec2]['']
                    let spec_1 = item.spec_1
                    rows = (
                        <TouchableOpacity
                            key={spec1}
                            onPress={() => this.selectSpec1(item)}
                            style={[{
                                width: 74,
                                height: 74,
                                marginRight: 10,
                                borderWidth: 2,
                                marginBottom: 10
                            }, this.state.spec_1 == spec_1 ? {borderColor: "#ee2319"} : {borderColor: "transparent"}]}>
                            <Image
                                source={{uri: item.spec_photo}}
                                resizeMode={'cover'}
                                style={{width: 70, height: 70,}}
                            />
                        </TouchableOpacity>
                    )
                    list.push(rows)
                }
            }
        }
        return list
    }

    showGoodsColorNum() {
        let goodsData = this.state.goodsData
        return (
            <View style={{
                flexDirection: "row",
                width: Util.size.width,
                paddingHorizontal: 15,
                paddingVertical: 20,
                borderBottomWidth: 1,
                borderBottomColor: "#f0f0f0",
                alignItems: 'center'
            }}>
                <Text style={{
                    fontSize: 14,
                    color: "#000",
                    marginRight: 10
                }}>{this.numToChinese(goodsData.spec_name.spec_1.length)}色可选</Text>
                <ScrollView style={{flex: 1,}} horizontal={true} showsHorizontalScrollIndicator={false}>
                    {this.showSpecPhoto(goodsData.spec_list.spec_1)}
                </ScrollView>
            </View>
        )
    }

    selectBox(box) {
        let goodsData = this.state.goodsData
        let isBox = this.state.isBox
        let spec_stock
        if (isBox == box) {
            return false;
        }
        if (box == 1) {
            spec_stock = goodsData.goods.stock
        } else {
            spec_stock = goodsData.goods.single_stock
        }
        this.setState({
            isBox: box,
            spec_1: '',
            goods_img: goodsData.goods.default_image,
            spec_stock: spec_stock
        })
    }

    showSelect() {
        return (
            <View style={{
                flexDirection: "row",
                alignItems: 'center',
                justifyContent: 'center',
                borderBottomWidth: 1,
                borderBottomColor: "#f0f0f0",
            }}>
                <TouchableOpacity
                    onPress={() => this.selectBox(1)}
                    style={this.state.isBox == 1 ? styles.select_item : styles.normal_item}>
                    <Text style={this.state.isBox == 1 ? {fontSize: 14, color: "#ee2319"} : {
                        fontSize: 14,
                        color: "#333"
                    }}>整包</Text>
                </TouchableOpacity>
                <TouchableOpacity
                    onPress={() => this.selectBox(0)}
                    style={this.state.isBox == 0 ? styles.select_item : styles.normal_item}>
                    <Text style={this.state.isBox == 0 ? {fontSize: 14, color: "#ee2319"} : {
                        fontSize: 14,
                        color: "#333"
                    }}>单支</Text>
                </TouchableOpacity>
            </View>
        )
    }

    //收藏
    collectGoods() {
        let goodsData = this.state.goodsData
        let url
        let datakey = []
        if (goodsData.favorites == 0) {
            url = URLconstant.ADDFAVORITES_URL
            datakey['goods_id'] = this.state.goods_id;
        } else {
            url = URLconstant.DELETEFAVORITES_URL
            datakey['favorites_id'] = goodsData.favorites_id;
        }
        datakey['user_id'] = this.state.user_id;
        Util.get(url, datakey, (datas) => {
            Toast.show(datas.msg)
            if (datas.status == 0) {
                this.getGoodsIndex()
            }
        }, (err) => {

        })
    }

    showGoodsTitleView() {
        let goodsData = this.state.goodsData
        return (
            <View style={{paddingVertical: 15, flexDirection: 'row'}}>
                <View style={{
                    height: 50,
                    flex: 1,
                    justifyContent: 'center',
                    borderRightWidth: 1,
                    borderRightColor: "#f0f0f0",
                    paddingLeft: 15
                }}>
                    <Text style={{fontSize: 14, color: "#000", marginBottom: 5}}>{goodsData.goods.goods_name}</Text>
                    <Text style={{fontSize: 12, color: "#ee2319"}}>{this.state.spec_price}元/米</Text>
                </View>
                <TouchableOpacity onPress={() => this.collectGoods()}
                                  style={{width: 60, height: 50, alignItems: 'center', justifyContent: 'center'}}>
                    <Icon name={goodsData.favorites == 0 ? 'md-star-outline' : 'md-star'} color={'#ee2319'} size={25}/>
                </TouchableOpacity>
            </View>
        )
    }

    //前往领券中心
    toCoupon() {
       this.props.navigation.push('ReceiveCenter')
    }

    showOperaView() {
        let spec_1 = this.state.spec_1
        let spec_2 = this.state.spec_2
        let shop_name = this.state.shop_name
        return (
            <View style={{backgroundColor: "#fff", paddingHorizontal: 10, paddingBottom: 10}}>
                <TouchableOpacity onPress={() => this.toCoupon()} style={styles.opera_item}>
                    <Text style={{fontSize: 14, color: "#333"}}>领劵</Text>
                    <Image
                        source={require('../imgs/right_arrow.png')}
                        resizeMode={'cover'}
                        style={{width: 20, height: 20}}
                    />
                </TouchableOpacity>
                <TouchableOpacity onPress={() => this.setState({isOpen: true})} style={styles.opera_item}>
                    <Text style={{
                        fontSize: 14,
                        color: "#333"
                    }}>{!spec_1 && !spec_2 ? "选择规格" : spec_1 + ' ' + spec_2} {shop_name ? shop_name + '店' : '仓库'}</Text>
                    <Image
                        source={require('../imgs/right_arrow.png')}
                        resizeMode={'cover'}
                        style={{width: 20, height: 20}}
                    />
                </TouchableOpacity>
                <View style={styles.opera_item}>
                    <Text style={{fontSize: 14, color: "#333"}}>商品评价</Text>
                    <Image
                        source={require('../imgs/right_arrow.png')}
                        resizeMode={'cover'}
                        style={{width: 20, height: 20}}
                    />
                </View>
            </View>
        )
    }

    showGoodsDetail() {
        let goodsData = this.state.goodsData
        let imgHeightList = this.state.imgHeightList
        let goods_detail = goodsData.goods.goods_detail
        if (!goods_detail) {
            return null
        }
        return (
            <View>
                {
                    goodsData.goods.goods_detail.map((item, index) => {
                        return (
                            <Image
                                key={index}
                                source={{uri: item}}
                                resizeMode={'cover'}
                                style={{width: Util.size.width, height: imgHeightList[index]}}
                            />
                        )
                    })
                }
            </View>
        )
    }


    //立即购买
    ljgm() {
        let isBox = this.state.isBox
        let goodsData = this.state.goodsData
        let goods_id = this.state.goods_id
        let spec_1 = this.state.spec_1
        let spec_2 = this.state.spec_2
        if (!this.state.isOpen) {
            this.setState({
                isOpen: true
            })
            return false;
        }
        if (!spec_1) {
            if (this.state.isOpen) {
                Toast.show('请选择规格')
            } else {
                this.setState({
                    isOpen: true
                })
            }
            return false;
        }
        let spec_3 = ''
        let spec_id = goodsData.spec_list.spec_1[spec_1][spec_2][spec_3].spec_id
        let buyNum = this.state.buy_num
        let shop_id = this.state.shop_id
        let data = {spec_id, buyNum, goods_id, shop_id, isBox}
        this.props.navigation.push('ConfirmOrder',{
            data:data,
            user_id:this.state.user_id
        })
    }

    //加入购物车
    addCart() {
        let url = URLconstant.ADDCART_URL
        let datakey = []
        let isBox = this.state.isBox
        let goodsData = this.state.goodsData
        let goods_id = this.state.goods_id
        let spec_1 = this.state.spec_1
        let spec_2 = this.state.spec_2
        if (!spec_1) {
            this.setState({
                isOpen: true
            })
            return false;
        }
        let spec_3 = ''
        let spec_id = goodsData.spec_list.spec_1[spec_1][spec_2][spec_3].spec_id
        let buyNum = this.state.buy_num
        let shop_id = this.state.shop_id
        datakey['goods_id'] = goods_id;
        datakey['quantity'] = buyNum;
        datakey['user_id'] = this.state.user_id;
        datakey['spec_id'] = spec_id;
        datakey['is_means'] = isBox
        datakey['shop_id'] = shop_id
        Util.post(url, datakey, (datas) => {
            Toast.show(datas.msg)
            DeviceEventEmitter.emit('changeCart')
            this.setState({
                isOpen: false
            })
        }, (err) => {

        })
    }


    toFrame() {
       this.props.navigation.navigate('SelectPic')
    }


    toCart() {
        this.props.navigation.navigate('ShoppingCart')
    }

    showBottomView() {
        return (
            <View style={styles.goods_bottom_view}>
                <View style={styles.bottom_btn_1}>
                    <Image
                        source={require('../imgs/jy_msg.jpg')}
                        resizeMode={'cover'}
                        style={{width: 20, height: 20, marginBottom: 2}}
                    />
                    <Text style={{fontSize: 12, color: "#696969"}}>联系</Text>
                </View>
                <TouchableOpacity onPress={() => this.toCart()} style={styles.bottom_btn_1}>
                    <Image
                        source={require('../imgs/cart.png')}
                        resizeMode={'cover'}
                        style={{width: 20, height: 20, marginBottom: 2}}
                    />
                    <Text style={{fontSize: 12, color: "#696969"}}>购物车</Text>
                </TouchableOpacity>
                <View style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'center',
                    paddingRight: 10,
                    flex: 1
                }}>
                    <TouchableOpacity onPress={() => this.addCart()} style={styles.btn_style_1}>
                        <Text style={{fontSize: 14, color: "#fff"}}>加入购物车</Text>
                    </TouchableOpacity>
                    <TouchableOpacity onPress={() => this.toFrame()} style={styles.btn_style_2}>
                        <Text style={{fontSize: 14, color: "#fff"}}>定制配框</Text>
                    </TouchableOpacity>
                    <TouchableOpacity onPress={() => this.ljgm()} style={styles.btn_style_3}>
                        <Text style={{fontSize: 14, color: "#fff"}}>立即购买</Text>
                    </TouchableOpacity>
                </View>
            </View>
        )
    }

    showModalView() {
        return (
            <Modal
                isOpen={this.state.isOpen}
                style={styles.modal_view}
                position={'bottom'}
                swipeToClose={false}
                backdropPressToClose={false}
            >
                {this.showModalGoodsInfo()}
                {this.showSpec1()}
                {this.showSpec2()}
                {this.showWarehouse()}
            </Modal>
        )
    }


    addDelNum(type) {
        let buy_num = this.state.buy_num
        let spec_stock = this.state.spec_stock
        if (type == 'del') {
            if (buy_num > 1) {
                buy_num--
            }
        } else {
            if (buy_num < spec_stock) {
                buy_num++
            }
        }
        this.setState({
            buy_num: buy_num
        })
    }

    showModalGoodsInfo() {
        let goodsData = this.state.goodsData
        return (
            <View style={{
                flexDirection: 'row',
                alignItems: 'center',
                justifyContent: 'center',
                padding: 15,
                borderBottomWidth: 1,
                borderBottomColor: "#f0f0f0"
            }}>
                <Image
                    source={{uri: this.state.goods_img}}
                    resizeMode={'cover'}
                    style={{width: 90, height: 90}}
                />
                <View style={{flex: 1, paddingLeft: 10, justifyContent: 'space-between', height: 90}}>
                    <Text style={{fontSize: 14, color: "#000"}}>{goodsData.goods.goods_name}</Text>
                    <Text style={{fontSize: 14, color: "#ee2319"}}>{this.state.spec_price}元/米</Text>
                    <View style={{flexDirection: 'row', alignItems: 'center'}}>
                        <Text style={{fontSize: 12, color: "#969696"}}>库存:</Text>
                        <Text style={{fontSize: 12, color: "#ee2319"}}>{this.state.spec_stock}</Text>
                        <Text style={{fontSize: 12, color: "#969696"}}>{this.state.isBox == 1 ? "箱" : "支"}</Text>
                    </View>
                    <View style={{flexDirection: 'row', alignItems: 'center'}}>
                        <View style={styles.add_del_view}>
                            <TouchableOpacity
                                onPress={() => this.addDelNum('del')}
                                style={{width: 15, height: 15, alignItems: 'center', justifyContent: 'center'}}>
                                <Text style={{fontSize: 14, color: "#333"}}>-</Text>
                            </TouchableOpacity>
                            <View style={styles.buy_num_view}>
                                <Text style={{fontSize: 12, color: "#333"}}>{this.state.buy_num}</Text>
                            </View>
                            <TouchableOpacity
                                onPress={() => this.addDelNum('add')}
                                style={{width: 15, height: 15, alignItems: 'center', justifyContent: 'center'}}>
                                <Text style={{fontSize: 14, color: "#333"}}>+</Text>
                            </TouchableOpacity>
                        </View>
                        <Text style={{fontSize: 12, color: "#969696"}}>{this.state.isBox == 1 ? "箱" : "支"}</Text>
                    </View>
                    <TouchableOpacity
                        onPress={() => this.setState({isOpen: false})}
                        style={{position: 'absolute', top: 0, right: 0}}>
                        <Icon name={'ios-close-circle-outline'} color={'#969696'} size={20}/>
                    </TouchableOpacity>
                </View>
            </View>
        )
    }

    //展示规格1
    showSpec1() {
        let goodsData = this.state.goodsData
        return (
            <View style={{paddingHorizontal: 15, paddingTop: 10}}>
                <Text style={{fontSize: 14, color: "#000"}}>{goodsData.goods.spec_name_1}</Text>
                <View style={{flexDirection: 'row', flexWrap: 'wrap', marginTop: 10}}>
                    {this.showSpecPhoto(goodsData.spec_list.spec_1)}
                </View>
            </View>
        )
    }

    //展示规格2
    showSpec2() {
        let goodsData = this.state.goodsData
        let spec_2_list = this.state.spec_2_list
        if (spec_2_list.length == 0) {
            return null
        }
        return (
            <View style={{paddingHorizontal: 15, paddingTop: 10}}>
                <Text style={{fontSize: 14, color: "#000"}}>{goodsData.goods.spec_name_2}</Text>
                <View style={{flexDirection: 'row', flexWrap: 'wrap', marginTop: 10}}>
                    {
                        spec_2_list.map((item, index) => {
                            return (
                                <TouchableOpacity
                                    onPress={() => this.selectSpec2(item)}
                                    key={index}
                                    style={[styles.spec_item, item == this.state.spec_2 ? {backgroundColor: "#ee2319"} : null]}>
                                    <Text style={item == this.state.spec_2 ? {
                                        color: "#fff",
                                        fontSize: 12
                                    } : {color: "#333", fontSize: 12}}>{item}</Text>
                                </TouchableOpacity>
                            )
                        })
                    }
                </View>
            </View>
        )
    }

    //显示仓库
    showWarehouse() {
        let goodsData = this.state.goodsData
        let isBox = this.state.isBox
        return (
            <View style={{paddingHorizontal: 10, borderTopWidth: 1, borderTopColor: "#f0f0f0", marginTop: 20}}>
                <View style={{flexDirection: 'row', paddingVertical: 10}}>
                    <Text style={{fontSize: 14, color: "#000", marginRight: 5}}>选择仓库发货</Text>
                    <TouchableOpacity onPress={() => this.setState({shop_id: 0, shop_name: '平台总仓'})} style={{
                        paddingHorizontal: 10,
                        height: 24,
                        alignItems: 'center',
                        justifyContent: 'center',
                        backgroundColor: "#ee2319"
                    }}>
                        <Text style={{fontSize: 12, color: "#fff"}}>平台总仓</Text>
                    </TouchableOpacity>
                </View>
                <View style={{flexDirection: 'row', flexWrap: 'wrap'}}>
                    {
                        goodsData.store_shop.map((item, index) => {
                            return (
                                <TouchableOpacity
                                    key={index}
                                    onPress={() => this.setState({shop_id: item.id, shop_name: item.store_name})}
                                    style={item.id == this.state.shop_id ? styles.select_store : styles.store_item}>
                                    <Text style={item.id == this.state.shop_id ? {
                                        fontSize: 12,
                                        color: "#fff"
                                    } : {
                                        fontSize: 12,
                                        color: "#999"
                                    }}>{item.store_name}店 {isBox == 1 ? item.stock + '箱' : item.single_stock + '支'}</Text>
                                </TouchableOpacity>
                            )
                        })
                    }
                </View>
            </View>
        )
    }

    saveImageToAlbum() {
        let uri = this.state.goods_img
        LOG('uri==' + uri)
        if (Platform.OS === 'android') {
            //LOG("保存图片成功 data==" + uri);
            SaveModule.initSave(uri, (obj) => {
                Toast.show("保存图片成功");
            }, (err) => {
                Toast.show("保存图片失败");
            });
        } else {
            CameraRoll.saveImageWithTag(uri).done(function (data) {
                LOG("保存图片成功 data==" + data);
                Toast.show("保存图片成功", 2);
            }, function (err) {
                LOG("保存图片失败 err==" + err);
                Toast.show("保存图片失败", 2);

            });
        }
    }

    render() {
        return (
            <View style={{flex: 1,backgroundColor:"#fff"}}>
                <Header navigation={this.props.navigation} title={'商品详情'}/>
                {
                    this.state.loaded == false ?
                        <View style={{flex: 1}}>
                            {Util.loading()}
                        </View> :
                        <View style={{flex: 1}}>
                            <View style={{flex: 1}}>
                                <ScrollView style={{flex: 1}}>
                                    {this.showGoodsImg()}
                                    {this.showGoodsColorNum()}
                                    {this.showSelect()}
                                    {this.showGoodsTitleView()}
                                    <View style={{backgroundColor: "#f0f0f0", height: 10}}/>
                                    {this.showOperaView()}
                                    {this.showGoodsDetail()}
                                </ScrollView>
                                {this.showModalView()}
                            </View>
                            {this.showBottomView()}
                        </View>
                }
            </View>
        )
    }
}
var styles = StyleSheet.create({
    select_item: {
        height: 40,
        borderBottomWidth: 2,
        borderBottomColor: "#ee2319",
        alignItems: 'center',
        justifyContent: "center",
        paddingHorizontal: 20,
        marginHorizontal: 20
    },
    normal_item: {
        height: 40,
        borderBottomWidth: 2,
        borderBottomColor: "transparent",
        alignItems: 'center',
        justifyContent: "center",
        paddingHorizontal: 20,
        marginHorizontal: 20
    },
    opera_item: {
        height: 50,
        flexDirection: "row",
        alignItems: 'center',
        justifyContent: 'space-between',
        borderBottomWidth: 1,
        borderBottomColor: "#f0f0f0"
    },
    goods_bottom_view: {
        height: 50,
        flexDirection: 'row',
        alignItems: 'center',
        borderTopWidth: 1,
        borderTopColor: "#f0f0f0"
    },
    bottom_btn_1: {
        width: 50,
        height: 50,
        alignItems: 'center',
        justifyContent: 'center'
    },
    btn_style_1: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
        height: 36,
        borderTopLeftRadius: 18,
        borderBottomLeftRadius: 18,
        backgroundColor: "#ee1f12"
    },
    btn_style_2: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
        height: 36,
        backgroundColor: "#ffa200"
    },
    btn_style_3: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center',
        height: 36,
        borderTopRightRadius: 18,
        borderBottomRightRadius: 18,
        backgroundColor: "#ee1f12"
    },
    modal_view: {
        height: Util.size.height * 0.7,
        width: Util.size.width,
        backgroundColor: "#fff"
    },
    add_del_view: {
        width: 80,
        height: 17,
        borderWidth: 1,
        borderColor: "#e0e0e0",
        alignItems: 'center',
        justifyContent: 'center',
        flexDirection: 'row',
        marginRight: 5
    },
    buy_num_view: {
        flex: 1,
        height: 15,
        alignItems: 'center',
        justifyContent: 'center',
        borderLeftWidth: 1,
        borderLeftColor: "#e0e0e0",
        borderRightWidth: 1,
        borderRightColor: "#e0e0e0"
    },
    spec_item: {
        height: 20,
        paddingHorizontal: 7,
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: "#e6e6e6",
        marginRight: 10,
        marginBottom: 10
    },
    store_item: {
        height: 24,
        marginRight: 10,
        marginBottom: 10,
        paddingHorizontal: 5,
        alignItems: 'center',
        justifyContent: 'center',
        borderWidth: 1,
        borderColor: "#c0c0c0"
    },
    select_store: {
        height: 24,
        marginRight: 10,
        marginBottom: 10,
        paddingHorizontal: 5,
        alignItems: 'center',
        justifyContent: 'center',
        borderWidth: 1,
        borderColor: "#ee2319",
        backgroundColor: "#ee2319"
    }
})